<script id="apiTemplate" type="text/template">
    <div class="api-tab-content api-tab-content-id-{{d.id}} " api-id="{{d.id}}">
        <p>
            <i class="layui-icon layui-icon-face-smile-b" onclick="positionMenu({{d.id}})"></i>
            <span>方法名：{{d.api.method}} , 描述：{{d.api.name}} , 路径：{{d.api.path}}</span>
        </p>
        <hr/>
        <div class="layui-form">
            <div class="layui-form-item">
                <div class="layui-input-inline" style="width: 95px">
                    <select name="apiType" class="apiType">
                        {{# $.each({0: 'POST', 1: 'POST',2: 'GET',3: 'DELETE',4: 'PUT'},(i,v)=>{ }}
                        {{# if(d.api.type == i){ }}
                        <option selected value="{{v}}">{{v}}</option>
                        {{# }else { }}
                        <option value="{{v}}">{{v}}</option>
                        {{# } }) }}
                    </select>
                </div>
                <div class="layui-input-inline" style="width: 80px">
                    <select name="envApi" lay-verify="required" lay-filter="envApiFilter" data-id="{{d.id}}">
                        {{# $.each(d.envList,(i,v)=>{ }}
                        <option value="{{v.id}}" {{# if(v.id== d.envId){ }}selected{{# } }}>{{v.name}}</option>
                        {{# }) }}
                    </select>
                </div>
                <div class="layui-input-inline" style="width: 380px;">
                    <input type="text" class="layui-input apiPath" name="apiPath" data-path="{{d.api.path}}"
                           data-application-id="{{d.applicationId}}" value="{{getPath(d.api.path, d.applicationId)}}"/>
                </div>
                <div class="layui-input-inline">
                    <button class="layui-btn" lay-filter="apiFormBtn" onclick="commitApi({{d.id}})">提交
                    </button>
                </div>
            </div>
        </div>
        <div class="layui-row ">
            <!-- 请求参数 部分 -->
            <div class="layui-col-xs7">
                {{# let typeJsonObj = d.typeList.find(i=>i.type == 1 &&i.typeJson);
                    let isJsonParam =typeJsonObj && typeJsonObj.paramMode == ParamMode.json }}
                <div class="layui-tab layui-tab-brief tab-req-param-{{d.id}}" lay-filter="tab-req-param-{{d.id}}">
                    <ul class="layui-tab-title">
                        <li class="{{!isJsonParam?'layui-this':''}}">FormData</li>
                        <li lay-id="header">Header</li>
                        <li class="{{isJsonParam?'layui-this':''}}">JSON</li>
                    </ul>
                    <div class="layui-tab-content ">
                        <!-- FormData 参数 -->
                        <div class="layui-tab-item param-div req-param-form-data {{!isJsonParam?'layui-show':''}}">
                            <table class="layui-table layui-form" lay-size="sm">
                                <thead>
                                <th width="35px"><i class="layui-icon layui-icon-addition layui-icon-addition-max"
                                                  onclick="addFromDataTr()"></i></th>
                                <th width="20%">参数</th>
                                <th width="20%">值</th>
                                <th width="62px">类型</th>
                                <th>描述</th>
                                </thead>
                                {{# $.each((d.formDataFields) ,(i,v)=>{ }}
                                <tr data-paramMode="{{v.paramMode||0}}">
                                    <td><input type="checkbox" name="enable" lay-skin="switch" checked="checked"></td>
                                    <td><input class="layui-input param-value" api-paramMode="" api-type=""
                                               name="paramName" type="text" value="{{v.paramName}}"/>
                                    </td>
                                    <td><input class="layui-input param-value" api-paramMode="" api-type=""
                                               name="paramValue" type="{{BaseType[v.type]||'text'}}" multiple="multiple" value=""/>
                                    </td>
                                    <td>
                                        <select class="input-sm" name="paramType">
                                            <option value="{{BaseType[v.type]||'text'}}" selected >{{BaseType[v.type]||'text'}}</option>
                                            <option value="text">Text</option>
                                            <option value="file">File</option>
                                        </select>
                                    </td>
                                    <td>{{v.type}}，{{v.paramDescribe||''}}</td>
                                </tr>
                                {{# }) }}
                            </table>
                        </div>
                        <!-- Header 参数 -->
                        <div class="layui-tab-item param-div">
                            <table class="layui-table layui-form req-param-header" lay-size="sm">
                                <thead>
                                <th width="8%"><i class="layui-icon layui-icon-addition layui-icon-addition-max"
                                                  onclick="addHeaderTr()"></i></th>
                                <th width="18%">参数</th>
                                <th width="74%">值</th>
                                </thead>
                                {{# $.each((currProjectData.env.headerMap|| []) ,(i,v)=>{ }}
                                <tr class="header-data-{{v.key}}">
                                    <td><input type="checkbox" name="enable" lay-skin="switch" checked="true"></td>
                                    <td><input class="layui-input header-key" api-type="" data-id="env-{{ currProjectData.env.id+'-'+v.key }}"
                                               name="headerKey" type="text" value="{{v.key}}"/>
                                    </td>
                                    <td><input class="layui-input header-value" api-type=""
                                               name="headerValue" type="text" value="{{v.value}}"/>
                                    </td>
                                </tr>
                                {{# }) }}
                            </table>
                            <div class="layui-form-item">
                                <button class="layui-btn layui-btn-sm" onclick="overallSituationEnv({{d.id}})">全局修改</button>
                            </div>
                        </div>
                        <!-- JSON 参数 -->
                        <div class="layui-tab-item {{isJsonParam?'layui-show':''}}">
                            <textarea class="json-text req-param-json">{{formatJson1(isJsonParam?typeJsonObj.typeJson:'')}}</textarea>
                        </div>
                    </div>
                </div>
            </div>
            <!-- DOC 部分 -->
            <div class="layui-col-xs5">
                <div class="layui-tab layui-tab-brief" lay-filter="tab-out-param">
                    <ul class="layui-tab-title">
                        <li class="layui-this">DOC</li>
                        <li>JSON</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show param-div">
                            <!-- 方法参数信息 -->
                            <table class="layui-table" lay-size="sm">
                                <thead>
                                <th width="20%">参数</th>
                                <th width="20%">类型</th>
                                <th width="60%">描述</th>
                                </thead>
                                {{# let reqParam = d.api.apiParamList.filter(i=>i.type==1); }}
                                {{# reqParam.forEach(v=>{ }}
                                <tr>
                                    <td>{{v.paramName}}</td>
                                    <td>{{v.dataType}}</td>
                                    <td>{{v.paramDescribe||''}}</td>
                                </tr>
                                {{# }); }}
                                {{# if(reqParam.length ==0){ }}
                                <tr>
                                    <td colspan="4">无</td>
                                </tr>
                                {{# } }}
                            </table>
                            <!-- 类信息 字段 -->
                            {{# d.typeList.filter(i=>i.type == 1 && i.classFieldList).forEach(v=>{ }}
                            <table class="layui-table" lay-size="sm">
                                <thead>
                                <tr>
                                    <th colspan="4">{{v.className+ (v.classDescribe? '：'+v.classDescribe :'')}}</th>
                                </tr>
                                <tr>
                                    <th width="20%">参数</th>
                                    <th width="20%">类型</th>
                                    <th width="60%">描述</th>
                                </tr>
                                </thead>
                                {{# $.each(v.classFieldList,(i,f)=>{ }}
                                <tr>
                                    <td>{{f.paramName}}</td>
                                    <td>{{f.type}}</td>
                                    <td>{{f.paramDescribe}}</td>
                                </tr>
                                {{# }) }}
                            </table>
                            {{# }) }}
                        </div>
                        <div class="layui-tab-item ">
                            <!--                        JSON字符串请求参数 -->
                            <textarea class="json-text">{{formatJson1((typeJsonObj||'').typeJson)}}</textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <hr>
        <div class="layui-row">
            <div class="layui-col-xs7">
                <div class="layui-tab layui-tab-brief" lay-filter="tab-out-param">
                    <ul class="layui-tab-title">
                        <li class="layui-this">Response Body</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <textarea class="json-text responseJson"></textarea>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs5">
                <div class="layui-tab layui-tab-brief" lay-filter="tab-out-param">
                    <ul class="layui-tab-title">
                        <li class="layui-this">DOC</li>
                        <li>JSON</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item param-div layui-show">
                            <table class="layui-table" lay-size="sm">
                                <thead>
                                    <th width="30%">返回值类型</th>
                                    <th width="70%">描述</th>
                                </thead>
                                <tr>
                                    {{# let op = d.api.apiParamList.find(i=>i.type==2); }}
                                    {{# if(op != null){ }}
                                    <td>{{op.paramName}}</td>
                                    <td>{{op.paramDescribe||''}}</td>
                                    {{# } else{ }}
                                    <td colspan="3">无</td>
                                    {{# } }}
                                </tr>
                            </table>
                            {{# d.typeList.filter(i=>i.type == 2 && i.classFieldList).forEach(v=>{ }}
                            <table class="layui-table" lay-size="sm">
                                <thead>
                                <tr>
                                    {{# let classDesc = v.className+ (v.classDescribe ? '：'+v.classDescribe : '');}}
                                    <th colspan="3">{{classDesc}}</th>
                                </tr>
                                <tr>
                                    <th width="20%">参数</th>
                                    <th width="20%">类型</th>
                                    <th width="60%">描述</th>
                                </tr>
                                </thead>
                                {{# $.each(v.classFieldList,(i,v)=>{ }}
                                <tr>
                                    <td>{{v.paramName}}</td>
                                    <td>{{v.type}}</td>
                                    <td>{{v.paramDescribe}}</td>
                                </tr>
                                {{# }) }}
                            </table>
                            {{# }) }}
                        </div>
                        {{# typeJsonObj =(d.typeList.find(i=>i.type == 2&& i.typeJson )||{}); }}
                        <div class="layui-tab-item">
                            <textarea class="json-text">{{formatJson1(typeJsonObj.typeJson)}}</textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</script>